<!DOCTYPE html>
<html lang="zh-EN" class="">
<head>
<meta charset="utf-8"/>
<title>微博 - 向世界分享你的快乐</title>
<link style="background-color=red"  href="{{url('imgs/login/favicon.ico')}}" type="image/x-icon"/>
<link rel="stylesheet" href="{{url('css/login/main.cc.css')}}"/>
<!--[if lt IE 9]>
<script src="https://static.zhihu.com/static/components/respond/dest/respond.min.js"></script>
<link href="https://static.zhihu.com/static/components/respond/cross-domain/respond-proxy.html" id="respond-proxy" rel="respond-proxy"/>
<link href="/static/components/respond/cross-domain/respond.proxy.gif" id="respond-redirect" rel="respond-redirect"/>
<!--<script src="/static/components/respond/cross-domain/respond.proxy.js"></script>-->
{{--<![endif]-->--}}
</head>
<style type="text/css">
  .big-img{margin-top: 20px;}
  .subtitle{font-family: 宋体}
  .footer{margin-top: 20px}
</style>
<body class="zhi ">
<div class="index-main">
  <div class="index-main-body">
    <div class="index-header">
      <!-- <h1 class="">微   博</h1> -->
      <img src="{{url('img/home/login/big-logo.png')}}" alt="" width="200px;" height="66px;" class="big-img">
      <h2 class="subtitle">随时记录身边事,向世界分享你的快乐
    </div>
    <div class="desk-front sign-flow clearfix sign-flow-simple">
      <div class="index-tab-navs">
        <div class="navs-slider">
          <a href="#signup" class="active" id="zhuce" style="text-decoration:none;">注册</a>

          <a href="#signin" id="denglu" style="text-decoration:none;" >登录</a>
          {{--<span class="navs-slider-bar"></span>    --}}
        </div>
      </div>


      <div class="view view-signin" data-za-module="SignInForm" id="sgin">
        <form action="{{ url('/login_in') }}" method="post" >
          {{csrf_field()}}
          <div class="group-inputs" id="gro">
            <div class="account input-wrapper">
              <input type="text" name="u_name" aria-label="手机号" placeholder="用户名" required="" maxlength="11" />
            </div>
            <div class="verification input-wrapper">
              <input type="password" name="u_pwd" aria-label="密码" placeholder="密码" required=""  />
            </div>
            <div class="Captcha input-wrapper" data-type="cn" data-za-module="Captcha">
              <div class="Captcha-operate">
              </div>
              <div class="Captcha-imageConatiner">
                <img class="Captcha-image" alt="验证码"/>
              </div>
            </div>
          </div>
          <div class="button-wrapper command">
            <button class="sign-button submit" type="submit">登录</button>
          </div>
          <div class="signin-misc-wrapper clearfix">
            <button type="button" class="signin-switch-button">手机验证码登录</button>
            <a class="unable-login" href="#">无法登录？</a>
          </div>
          <div class="social-signup-wrapper" data-za-module="SNSSignIn">
            <span class="name js-toggle-sns-buttons">社交帐号登录</span>
            <div class="sns-buttons">
              <a title="微信登录" class="js-bindwechat" href="#"><i class="sprite-index-icon-wechat"></i></a>
              <a title="微博登录" class="js-bindweibo" href="#"><i class="sprite-index-icon-weibo"></i></a>
              <a title="QQ 登录" class="js-bindqq" href="#"><i class="sprite-index-icon-qq"></i></a>
            </div>
          </div>
        </form>

        {{--登录end--}}

        {{-- 二维码界面 --}}
        <div class="QRCode">
          <button class="QRCode-toggleButton" id="xiazai_1">
            <span class="sprite-global-icon-qrcode"></span>
            <span class="QRCode-toggleButtonText " id="span_text_1" >下载微博 App</span>
          </button>
          <div class="QRCode-card"  id="qr_code">
            <div class="QRCode-image">

              {{--//生成的二维码--}}
              <div class="visible-print text-center">
                {!! QrCode::size(250)->generate(Request::url()); !!}
                {{--<p>扫我</p>--}}
              </div>
              {{--生成结束--}}

            </div>
            <div class="sprite-index-icon-arrow">
            </div>
          </div>
        </div>
      </div>


    {{--二维码end--}}
    <div class="view view-signup selected" data-za-module="SignUpForm"  id="sgup">


<!-- 注册表单 -->
  <form class="zhuce" action="{{ url('/login') }}" name="ckname" method="post"  onsubmit="return checkForm()">
              {{ csrf_field() }}
          <div class="group-inputs">
            <div class="name input-wrapper">
              <input required="" type="text" id="pipei" name="u_name" aria-label="姓名" placeholder="姓名" onblur="checkname()" />
            </div>
            <div class="email input-wrapper">
              <input required="" type="text" id="pptel"  class="account" name="u_tel" aria-label="手机号" placeholder="手机号" onblur="checktel()" maxlength ="11" />
            </div>
            <div class="input-wrapper">
              <input required="" type="password" id="pppw" name="u_pwd" aria-label="密码" placeholder="密码（不少于 6 位）" onblur="checkpwd()" />
            </div>
            <div class="Captcha input-wrapper" data-type="cn" data-za-module="Captcha">
              <div class="Captcha-operate">
              </div>
              <div class="Captcha-imageConatiner">
                <img class="Captcha-image" alt="验证码"/>
              </div>
            </div>
          </div>
          <div class="button-wrapper command">
            <button class="sign-button submit" type="submit">注册微博</button>
          </div>
  </form>
<!-- 注册end -->
        <p class="agreement-tip">
          点击「注册」按钮，即代表你同意<a href="/terms" target="_blank">《微博协议》</a>
        </p>
        <div class="QRCode">
          <button class="QRCode-toggleButton" id="xiazai">
            <span class="sprite-global-icon-qrcode"></span>
            <span class="QRCode-toggleButtonText "  id="span_text">下载微博 App</span></button>
          <div class="QRCode-card"  id="qr_code_1" style="display: none;">
            <div class="QRCode-image">

              {{--//生成的二维码--}}
              <div class="visible-print text-center">
                {!! QrCode::size(250)->generate(Request::url()); !!}
                {{--<p>扫我</p>--}}
              </div>
            {{--生成结束--}}
            </div>
            <div class="sprite-index-icon-arrow">
            </div>
          </div>




        </div>
      </div>
    </div>
  </div>
</div>
<div class="footer">
  <span>&copy; 2017 微博</span>
  <span class="dot">&middot;</span>
  <a target="_blank" href="https://zhuanlan.zhihu.com">微博专栏</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/roundtable">微博圆桌</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/explore" data-za-c="explore" data-za-a="visit_explore" data-za-l="home_bottom_explore">发现</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/app">移动应用</a>
  <span class="dot">&middot;</span>
  <a href="/org/signin" class="footer-mobile-show">使用机构帐号登录</a>
  <span class="dot footer-mobile-show">&middot;</span>
  <a href="/contact" class="footer-mobile-show">联系我们</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/careers">来sina微博工作</a>
  <br/>
  <a href="http://www.miibeian.gov.cn/" target="_blank">沪 FBI 证 9188888 号</a>
  <span class="dot">&middot;</span>
  <span>京沪网安备 9999999999999 号</span>
  <span class="dot">&middot;</span>
  <a href="http://zhstatic.zhihu.com/assets/zhihu/publish-license.jpg" target="_blank">出版物经营许可证</a>
  <span class="dot">&middot;</span>
  <a target="_blank" href="/jubao">侵权投诉</a>
  <span class="dot">&middot;</span>
  <span>违法和不良信息举报：6666666666</span>
  <div class="chengxing">
    <a id="___szfw_logo___" href="https://credit.szfw.org/CX20170607038331320388.html" target="_blank"><img src="./img/home/chengxing_logo@2x.65dc76e8.png" border="0"/></a>
  </div>

  <script src="{{url('js/home/jquery-1.8.3.min.js')}}"></script>

  <script>

      var signin = document.getElementById('sgin');
      var signup = document.getElementById('sgup');
      var groo = document.getElementById('gro');
//      console.log(signin , signup);

//

//    console.log($("sgin").addClass('selected'));

      denglu.onclick =function() {

          $("#sgin").addClass('selected','selected');
          $('#sgup').removeClass('selected');
          $('#denglu').addClass('active');
          $('#zhuce').removeClass('active');
      }

      zhuce.onclick =function() {

          $("#sgin").removeClass('selected');
          $('#sgup').addClass('selected','selected');
          $('#zhuce').addClass('active');
          $('#denglu').removeClass('active');
      }



      // 登录二维码部分

      xiazai_1.onclick= function(){

          $('#qr_code').fadeToggle('slow','linear');
      }

      //注册部分的二维码
      xiazai.onclick= function(){

          $('#qr_code_1').fadeToggle('slow','linear');
      }


      //用户名验证
    function checkname(){

          var ckname = document.ckname.u_name.value;

//          var info =$('#pipei').serialize();

          $.ajax({
              type:'get',
              url:"{{url('ajax')}}/" + ckname,
              success:function(data){
                  if (data == 1){

                     alert('用户已存在');
                  }
              },
              error: function(xhr, type){
                  alert('Ajax error!');
              }

          })



          if (ckname.match(/^([a-zA-Z0-9_\u4e00-\u9fa5]){3,16}$/) == null) {

             $('#pipei').after("<label id='666' class='error is-visible'>由数字字母下划线任意组成</label>");

              //获取焦点
              var input = document.getElementById('pipei');
              input.onfocus =function(){
                  $('#666').remove();
             return false;
          }
              return true;
          }
    }

      //手机号验证
      function checktel(){

          var ckname = document.ckname.u_tel.value;

          if (ckname.match(/^0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8}$/) == null) {

              $('#pptel').after("<label id='777' class='error is-visible'>请输入正确的手机号</label>");
              //获取焦点
              var input = document.getElementById('pptel');
              input.onfocus =function(){
                  $('#777').remove();
              }
              return false;
          }
          return true;
      }

      //密码验证
      function checkpwd(){

          var ckname = document.ckname.u_pwd.value;

          if (ckname.length < 6 || ckname.length > 18) {

              $('#pppw').after("<label id='778' class='error is-visible'>密码长度最少六位</label>");
              //获取焦点
              var input = document.getElementById('pppw');
              input.onfocus =function(){
                  $('#778').remove();
              }
              return false;
          }
          return true ;
      }
      //验证全部为 true 时  执行发送数据
      function checkForm(){

          return  checkpwd() && checkname() && checktel();
      }






  </script>

  </body>
  </html>